import React, {Component} from 'react';
import BreadcrumbCustom from '../../components/BreadCrumb';

import axios from 'axios' ;
import { Pagination } from 'antd';

const _this = this;
class HttpServer extends Component {
  constructor(props) {
    super(props);
    this.state = {
      newsList: [],
      pageTotal: 1,
      pageCurrent: 1,
      pageSize: 5,
    }
  }
  // state = {
  //   newsList: [],
  //   pageTotal: 1,
  // }

  componentWillMount() {
    // this.getList()
    this.getData(1)
  }

  // 不封装 axios (直接调用)
  getList() {
    let  url="http://shanzhouweb.yewu99.com:1103/szweb/list"
    axios.post(url)
      .then(function (response) {
        let data =response.data
        console.log(data);
      })
      .catch(function (error) {
        console.log(error);
      });
  }
  getData(page) {
    let _this = this;
    this.$api.getNewsList({
      num: 5,
      page: page
    }).then(res => {
      console.log(res)
      let data = res.data
      if(res.code === 1) {
        _this.setState({
          pageTotal: data.total,          
        })
        // console.log(data.total)
        // console.log(this.state.pageTotal)
      } else {
        console.log(data.msg)
      }
    })
  }
  
  changePage(pageNumber) {
    let page = pageNumber || 2
    // this.getData(page)  // error
  }

  render() {

    return (
      <div>
        <BreadcrumbCustom paths={['index', 'nav2', 'axios']} />
        <div>http data</div>
        {/* <button onClick={(pageNumber) => this.changePage(pageNumber)}>changePage</button> */}

        <Pagination 
          showQuickJumper 
          defaultCurrent={1}
          current={this.state.pageCurrent} 
          total={this.state.pageTotal} 
          pageSize={this.state.pageSize}
          onChange={this.changePage} />,mountNode
      </div>
      
    )

  }

}

export default HttpServer;